<template>
  <el-dialog :title="isEdit?'编辑账页':'新增账页'"
             :visible.sync="dialogForm"
             width="720px">
    <el-form :inline="true"
             ref="addForm"
             :model="addForm"
             :rules="rules"
             class="add-form"
             label-width="80px">
      <el-row>
        <el-col :span="12">
          <el-form-item label="货主"
                        prop="cargoOwnerName">
            <auto-search-name v-model="addForm.cargoOwnerName"
                              placeholder="请选择"  
                              @selectName="v=>addForm.cargoOwnerName=v"
                              @selectId="v=>addForm.cargoOwnerId=v"
                              :name="addForm.cargoOwnerName"></auto-search-name>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="品名"
                        prop="cargoName">
            <el-select v-model="addForm.cargoName"
                       placeholder="请选择"
                       clearable
                       filterable
                       @change="handleCargoChange('normOneDisabled')">
              <el-option v-for="(item,index) in cargoNameList"
                         :key="index"
                         :label="item.cargoName"
                         :value="item.cargoName"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="规格"
                        required>
            <el-col :span="8">
              <el-form-item prop="normOne"
                            class="gg-input">
                <el-select v-model="addForm.normOne"
                           placeholder="请选择"
                           @change="handleCargoChange('normTwoDisabled')"
                           clearable>
                  <el-option v-for="(item,index) in piecesdLIst"
                             :key="index"
                             :label="item.cargoInfo.normOne"
                             :value="item.cargoInfo.normOne"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item prop="normTwo"
                            class="gg-input">
                <el-select v-model="addForm.normTwo"
                           placeholder="请选择"
                           @change="handleCargoChange('normThreeDisabled')"
                           clearable>
                  <el-option v-for="(item,index) in piecesdLIst"
                             :key="index"
                             :label="item.cargoInfo.normTwo"
                             :value="item.cargoInfo.normTwo"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item prop="normThree"
                            class="gg-input">
                <el-select v-model="addForm.normThree"
                           placeholder="请选择"
                           clearable>
                  <el-option v-for="(item,index) in piecesdLIst"
                             :key="index"
                             :label="item.cargoInfo.normThree"
                             :value="item.cargoInfo.normThree"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="材质"
                        prop="material">
            <el-select v-model="addForm.material"
                       placeholder="请选择"
                       @change="handleCargoChange('material')"
                       clearable>
              <el-option v-for="(item,index) in piecesdLIst"
                         :key="index"
                         :label="item.cargoInfo.material"
                         :value="item.cargoInfo.material"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="生产厂家"
                        prop="madeBy">
            <el-select v-model="addForm.madeBy"
                       placeholder="请选择"
                       @change="handleCargoChange('material')"
                       clearable>
              <el-option v-for="(item,index) in piecesdLIst"
                         :key="index"
                         :label="item.cargoInfo.madeBy"
                         :value="item.cargoInfo.madeBy"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="管理方式"
                        prop="manageWay">
            <el-select v-model="addForm.manageWay"
                       placeholder="请选择"
                       @change="handleCargoChange('manageWay')"
                       clearable
                       filterable>
              <el-option v-for="(item,index) in piecesdLIst"
                         :key="index"
                         :label="item.cargoInfo.manageWay"
                         :value="item.cargoInfo.manageWay"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <!-- </el-row>
      <el-row> -->
        <el-col :span="12">
          <el-form-item label="计量方式"
                        prop="measureWay">
            <el-select v-model="addForm.measureWay"
                       placeholder="请选择"
                       clearable
                       filterable>
              <el-option v-for="(item,index) in piecesdLIst"
                         :key="index"
                         :label="item.cargoInfo.measureWay"
                         :value="item.cargoInfo.measureWay"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="所属仓库"
                        prop="warehouseId">
            <el-select v-model="addForm.warehouseId"
                       placeholder="请选择"
                       clearable>
              <el-option v-for="(item,index) in warehouseList"
                         :key="index"
                         :label="item.name"
                         :value="item.id"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="账页类型"
                        prop="accountPageType">
            <el-select v-model="addForm.accountPageType"
                       placeholder="请选择"
                       clearable
                       filterable>
              <el-option v-for="[key, val] in _dictAccountPageType"
                         :key="key"
                         :label="val"
                         :value="key"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="24">
          <el-form-item label="备注"
                        prop="remark">
            <el-input type="textarea"
                      :rows="3"
                      style="width: 560px"
                      placeholder="请输入内容"
                      :maxLength="$maxLength"
                      v-model="addForm.remark"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <div slot="footer"
         class="dialog-footer">
      <el-button @click="dialogForm = false">取 消</el-button>
      <el-button type="primary"
                 @click="handleSubmit"
                 :loading="$store.getters.loadingBtn">保 存</el-button>
    </div>
  </el-dialog>
</template>

<script>
import { addThings, updateThings } from '@/api/things/things'
import autoSearchDic from '@/components/autocomplete/autoSearchDic' //规格组件
import { maxLength, sortLength } from '@/utils/rules'
import {
  getCargoOwnerAccount,
  addAccountPage,
  getAccountPageList,
  deleteAccountPage,
  updateAccountPage,
  getCargoNameList,
  getPiecesCargo
} from '@/api/things/accountPageList'
import autoCargo from '@/components/autocomplete/autoCargo'
import autoSearchName from '@/components/autocomplete/autoSearchName' //货主组件
import { management, meterStyle } from '../../../../assets/dict'
import { getWarehouseList } from '@/api/adminWarehouse/adminWarehouse' //所属仓库来源于仓库设置
export default {
  name: 'thingAttributeForm',
  components: { autoSearchDic, autoCargo, autoSearchName },
  data() {
    return {
      addForm: this.clearForm(),
      condition: {}, // 查询条件
      warehouseList: [], //仓库列表
      rules: {
        cargoOwnerName: [
          { required: true, message: '请选择货主', trigger: 'change' }
        ],
        cargoName: [{ required: true, message: '请选择品名', trigger: 'change' }],
        normOne: [
          { required: true, message: '请输入规格1', trigger: 'change' }
        ],
        normTwo: [
          { required: true, message: '请选择规格2', trigger: 'change' }
        ],
        normThree: [
          { required: true, message: '请选择规格3', trigger: 'change' }
        ],
        material: [
          { required: true, message: '请选择材质', trigger: 'change' }
        ],
        madeBy: [
          { required: true, message: '请选择生产厂家', trigger: 'change' }
        ],
        manageWay: [
          { required: true, message: '请选择管理方式', trigger: 'change' }
        ],
        measureWay: [
          { required: true, message: '请选择计量方式', trigger: 'change' }
        ],
        warehouseId: [
          { required: true, message: '请选择所属仓库', trigger: 'change' }
        ],
        accountPageType: [
          { required: true, message: '请选择账页类型', trigger: 'change' }
        ]
      },
      dialogForm: false,
      isEdit: false,
      maxLot: 0,
      selectThingsType: [],
      selectGoodsType: [],
      selectGroductName: [],
      piecesdLIst: [], //接口获取的货物属性数据
      cargoOwnerAccount: [], //货主账页
      cargoNameList: [], //货名列表
      normTwoDisabled: true, //规则框禁用
      normOneDisabled: true,
      normThreeDisabled: true,
      otherDisabled: true,
      piecesdatas: {
        //货物属性接口参数
        search_EQ_cargoCode: '',
        search_EQ_cargoName: '',
        search_EQ_madeBy: '',
        search_EQ_manageWay: '',
        search_EQ_material: '',
        search_EQ_measureWay: '',
        search_EQ_normOne: '',
        search_EQ_normThree: '',
        search_EQ_normTwo: ''
      }
    }
  },
  mounted() {
    this.selectChange()
  },
  methods: {
    clearForm() {
      return {
        orgId:
          this.$store.state.user.currentUser.org &&
          this.$store.state.user.currentUser.org.id,
        orgName:
          this.$store.state.user.currentUser.org &&
          this.$store.state.user.currentUser.org.cargoName,
        // 新加
        id: null, //账页id
        accountpageNo: '',
        cargoOwnerId: '',
        // cargoOwnerCode: '',
        // cargoOwnerName: '', //货主
        cargoName: '', //品名
        cargoId: '',
        normOne: '',
        normThree: '',
        normTwo: '',
        material: '',
        madeBy: '',
        manageWay: '',
        measureWay: '',
        accountPageType: '',
        warehouseName: '',
        warehouseId: '',
        remark: '',
        //参数需要
        balanceCount: 0,
        balanceNum: 0,
        balanceWeight: 0.0,
        ifForbidAccount: false,
        preWeight: 0
      }
    },
    selectChange(val) {
      //获取货主
      getCargoOwnerAccount(this.$store.state.user.currentUser.org.id).then(
        res => {
          this.cargoOwnerAccount = res.data.aaData
        }
      )
      //获取仓库
      getWarehouseList().then(res => {
        this.warehouseList = res.data.aaData
      })
      //获取货名
      getCargoNameList(this.$store.state.user.currentUser.org.id).then(res => {
        this.cargoNameList = res.data.aaData
      })
    },
    handleCargoChange(status) {
      let that = this
      if (that.addForm.cargoName) {
        //获取规格1
        for (var i = 0; i < that.cargoNameList.length; i++) {
          if (that.cargoNameList[i].cargoName == that.addForm.cargoName) {
            that.piecesdatas.search_EQ_cargoCode = that.cargoNameList[i].cargoCode
            that.piecesdatas.search_EQ_cargoName = that.cargoNameList[i].cargoName
            that.piecesdatas.search_EQ_madeBy = that.addForm.madeBy
            that.piecesdatas.search_EQ_manageWay = that.addForm.manageWay
            that.piecesdatas.search_EQ_material = that.addForm.material
            that.piecesdatas.search_EQ_measureWay = that.addForm.measureWay
            that.piecesdatas.search_EQ_normOne = that.addForm.normOne
            that.piecesdatas.search_EQ_normTwo = that.addForm.normTwo
            that.piecesdatas.search_EQ_normThree = that.addForm.normThree
            that.$nextTick(function() {
              switch (status) {
                case 'normOneDisabled':
                  // that.form.cargoCode = ''
                  // that.addForm.cargoId = ''
                  that.piecesdatas.search_EQ_cargoName = that.addForm.cargoName
                  that.piecesdatas.search_EQ_madeBy = ''
                  that.addForm.madeBy = ''
                  that.piecesdatas.search_EQ_manageWay = ''
                  that.addForm.manageWay = ''
                  that.piecesdatas.search_EQ_material = ''
                  that.addForm.material = ''
                  that.piecesdatas.search_EQ_measureWay = ''
                  that.addForm.measureWay = ''
                  that.piecesdatas.search_EQ_normOne = ''
                  that.addForm.normOne = ''
                  that.piecesdatas.search_EQ_normTwo = ''
                  that.addForm.normTwo = ''
                  that.piecesdatas.search_EQ_normThree = ''
                  that.addForm.normThree = ''
                  break
                default:
                  console.log('其他')
              }
              that.getgetPiecesCargoApi()
            })
          }
        }
      }else{
        that.addForm.cargoId = ''
        that.piecesdatas.search_EQ_madeBy = ''
        that.addForm.madeBy = ''
        that.piecesdatas.search_EQ_manageWay = ''
        that.addForm.manageWay = ''
        that.piecesdatas.search_EQ_material = ''
        that.addForm.material = ''
        that.piecesdatas.search_EQ_measureWay = ''
        that.addForm.measureWay = ''
        that.piecesdatas.search_EQ_normOne = ''
        that.addForm.normOne = ''
        that.piecesdatas.search_EQ_normTwo = ''
        that.addForm.normTwo = ''
        that.piecesdatas.search_EQ_normThree = ''
        that.addForm.normThree = ''
      }
    },
    getgetPiecesCargoApi() {
      let that = this
      let pam = that.filterPamars(that.piecesdatas);
      getPiecesCargo(pam).then(function(res) {
        that.piecesdLIst = res.data.aaData
        that.handleStatusCode(res.data.aaData)
        if (that.piecesdLIst.length == 1) {
          that.addForm.cargoId = that.piecesdLIst[0].id
          that.piecesdatas.search_EQ_cargoCode = that.piecesdLIst[0].cargoInfo.cargoCode
          that.addForm.cargoCode = that.piecesdLIst[0].cargoInfo.cargoCode
          that.piecesdatas.search_EQ_cargoName = that.piecesdLIst[0].cargoInfo.cargoName
          that.addForm.cargoName = that.piecesdLIst[0].cargoInfo.cargoName
          that.piecesdatas.search_EQ_madeBy = that.piecesdLIst[0].cargoInfo.madeBy
          that.addForm.madeBy = that.piecesdLIst[0].cargoInfo.madeBy
          that.piecesdatas.search_EQ_manageWay = that.piecesdLIst[0].cargoInfo.manageWay
          that.addForm.manageWay = that.piecesdLIst[0].cargoInfo.manageWay
          that.piecesdatas.search_EQ_material = that.piecesdLIst[0].cargoInfo.material
          that.addForm.material = that.piecesdLIst[0].cargoInfo.material
          that.piecesdatas.search_EQ_measureWay = that.piecesdLIst[0].cargoInfo.measureWay
          that.addForm.measureWay = that.piecesdLIst[0].cargoInfo.measureWay
          that.piecesdatas.search_EQ_normOne = that.piecesdLIst[0].cargoInfo.normOne
          that.addForm.normOne = that.piecesdLIst[0].cargoInfo.normOne
          that.piecesdatas.search_EQ_normTwo = that.piecesdLIst[0].cargoInfo.normTwo
          that.addForm.normTwo = that.piecesdLIst[0].cargoInfo.normTwo
          that.piecesdatas.search_EQ_normThree = that.piecesdLIst[0].cargoInfo.normThree
          that.addForm.normThree = that.piecesdLIst[0].cargoInfo.normThree
          // that.otherDisabled = false
          // that.normOneDisabled = false
          // that.normTwoDisabled = false
          // that.normThreeDisabled = false
          return false
        }
      })
    },
    handleStatusCode(datas) {
      for (var i = 0; i < datas.length; i++) {
        if (datas[i].cargoInfo.manageWay == 'UNIFIED') {
          datas[i].cargoInfo.manageWay = '统一管理'
        }
        if (datas[i].cargoInfo.manageWay == 'SPECIFY') {
          datas[i].cargoInfo.manageWay = '指定管理'
        }
        if (datas[i].cargoInfo.measureWay == 'ID') {
          datas[i].cargoInfo.measureWay = '标识'
        }
        if (datas[i].cargoInfo.measureWay == 'RULER') {
          datas[i].cargoInfo.measureWay = '检尺'
        }
        if (datas[i].cargoInfo.measureWay == 'WEIGHT') {
          datas[i].cargoInfo.measureWay = '检斤'
        }
      }
    },
    handleStatusCode1() {
      let that = this
      if (that.addForm.manageWay == '统一管理') {
        that.addForm.manageWay = 'UNIFIED'
      }
      if (that.addForm.manageWay == '指定管理') {
        that.addForm.manageWay = 'SPECIFY'
      }
      if (that.addForm.measureWay == '标识') {
        that.addForm.measureWay = 'ID'
      }
      if (that.addForm.measureWay == '检尺') {
        that.addForm.measureWay = 'RULER'
      }
      if (that.addForm.measureWay == '检斤') {
        that.addForm.measureWay = 'WEIGHT'
      }
      that.addForm.cargoCode = that.piecesdatas.search_EQ_cargoCode
      that.addForm.cargoName = that.piecesdatas.search_EQ_cargoName
    },
    handleCurrentChange(val) {
      this.currentRow = val
    },
    // 保存
    handleSubmit() {
      this.handleStatusCode1();
      this.$refs.addForm.validate(valid => {
        if (valid) {
          this.isEdit ? this.handleToEdit() : this.handleToAdd()
        } else {
          this.$message({
            message: '请检查表单',
            type: 'error'
          })
        }
      })
    },
    // 新增
    handleToAdd() {
      let that = this
      addAccountPage(that.addForm).then(res => {
        this.$message({ message: '新增成功!', type: 'success' })
        this.dialogForm = false
        this.$emit('load')
      })
    },
    //获取id
    getId(val) {
      this.addForm.id = val
    },
    // 编辑
    handleToEdit() {
      updateAccountPage(this.id, this.addForm).then(res => {
        this.$message({ message: '编辑成功!', type: 'success' })
        this.dialogForm = false
        this.$emit('load')
      })
    },
    // 获取货物的name
    getName(index) {
      this.selectGroductName.forEach(element => {
        if (this.addForm.cargos[index].cargoCode === element.cargoCode) {
          this.addForm.cargos[index].cargoName = element.cargoName
        }
      })
    },
    filterPamars(param) {
      let pam = {}
      for(let i in param){
        if(param[i] != ''){
          pam[i] = param[i]
        }
      }
      return pam;
    }
  },
  watch: {
    dialogForm(bool) {
      if (!bool) {
        this.$refs.addForm.resetFields()
        this.isEdit = false
        this.addForm = this.clearForm()
        this.$emit('clear')
      }else{  
        if(this.addForm.cargoName) {
          this.otherDisabled = false
          this.normOneDisabled = false
          this.normTwoDisabled = false
          this.normThreeDisabled = false
        }
      }
    }
  }
}
</script>

<style>
.gg-input .el-form-item__content .el-input,
.gg-input .el-form-item__content .el-select {
  width: 100px !important;
}
.gg-input {
  margin-bottom: 0 !important;
}
</style>
